:root {
	--background-color: #fff;
	/* 默认背景色 */
	--text-color: #000;
	/* 默认文字颜色 */
	--border-color: #738e9f;
	/* 默认边框颜色 */
	--background-image: linear-gradient(to right, #7e7eac, #9db3c8, #9fa5c5, #d0cbd2, #a1a7c7, #c6d3e3, #9397bc, #c6d3e3, #a1a7c7, #92a0be, #cecad1, #9db3c8, #7e7eac);
	/* 其他变量定义 */
}

.theme-default {
	/* 背景图片 */
	--background-image: linear-gradient(to right, #7e7eac, #9db3c8, #9fa5c5, #d0cbd2, #a1a7c7, #c6d3e3, #9397bc, #c6d3e3, #a1a7c7, #92a0be, #cecad1, #9db3c8, #7e7eac);
}

.theme-red {
	--background-color: #ff9999;
	--text-color: #000;
	--border-color: #ffaaaa;
	/* 背景图片 */
	--background-image: linear-gradient(to right, #ff9999, #ffaaaa, #ffbbbb, #ffcccc, #ffdddd, #ffeeee, #ffffff, #ffeeee, #ffdddd, #ffcccc, #ffbbbb, #ffaaaa, #ff9999);

	/* 其他风格特定的变量覆盖 */
}

.theme-green {
	--background-color: #6f9c5a;
	--text-color: #000;
	--border-color: #7eac70;
	--background-image: linear-gradient(to right, #6f9c5a, #7eac70, #8cbb85, #9cc99b, #abc8b0, #bad6c6, #c9e5db, #bad6c6, #abc8b0, #9cc99b, #8cbb85, #7eac70, #6f9c5a);
	/* 其他风格特定的变量覆盖 */
}

.theme-yellow {
	--background-color: #ffd27d;
	--text-color: #000;
	--border-color: #ffda8b;
	--background-image: linear-gradient(to right, #ffd27d, #ffda8b, #ffe199, #ffe8a6, #ffefb4, #fff6c2, #fffdc9, #fff6c2, #ffefb4, #ffe8a6, #ffe199, #ffda8b, #ffd27d);
	/* 其他风格特定的变量覆盖 */
}

.theme-grey {
	--background-color: #ffd27d;
	--text-color: #000;
	--border-color: #ffda8b;
	--background-image:  linear-gradient(to right, #52504b, #999ba4, #a49ba7, #b3bac4, #b3bac4, #b3bac4, #c7c9c7, #b3bac4, #a49ba7, #999ba4, #52504b);
	/* 其他风格特定的变量覆盖 */
}

.theme-zongse {
	--background-image: linear-gradient(to right, #713800, #945920, #965a1e, #ab6520, #944f0c, #925111, #713800);  }

#yxym .list-title {
	background: linear-gradient(transparent, #f7f3f3);
	font-size: 52rpx; // 26px
	color: #000;
	text-shadow: 0rpx 0rpx 20rpx #e5e5e5; // 0px 0px 10px
}

.list-title {
	font-size: 32rpx; // 16pt，假设1pt约等于1px
	text-align: center;
	border-bottom: 2rpx solid #738e9f; // 1px
	text-shadow: 2rpx 8rpx 2rpx #b99b5f; // 1px 4px 1px
	background: #fff;
	color: #000;
	font-weight: bold;
	border-top-left-radius: 10rpx; // 5px
	border-top-right-radius: 10rpx; // 5px
	padding: 4rpx 0rpx 8rpx 0rpx; // 2px 0px 4px 0px
}

.list-title .ctitle {
	font-size: 34rpx;
}

.box {
	margin: 10rpx 0; // 5px
	border-radius: 10rpx; // 5px
	overflow: hidden;
	background-image: var(--background-image);
	filter: progid:DXImageTransform.Microsoft.gradient(startcolorstr=#99000000, endcolorstr=#99000000);
}

.box-red {
	margin: 10rpx 0; // 5px
	border-radius: 10rpx; // 5px
	overflow: hidden;
	background-image: linear-gradient(to right, #ff9999, #ffaaaa, #ffbbbb, #ffcccc, #ffdddd, #ffeeee, #ffffff, #ffeeee, #ffdddd, #ffcccc, #ffbbbb, #ffaaaa, #ff9999);
	filter: progid:DXImageTransform.Microsoft.gradient(startcolorstr=#99000000, endcolorstr=#99000000);
}

.box-green {
	margin: 10rpx 0; // 5px
	border-radius: 10rpx; // 5px
	overflow: hidden;
	background-image: linear-gradient(to right, #6f9c5a, #7eac70, #8cbb85, #9cc99b, #abc8b0, #bad6c6, #c9e5db, #bad6c6, #abc8b0, #9cc99b, #8cbb85, #7eac70, #6f9c5a);
	filter: progid:DXImageTransform.Microsoft.gradient(startcolorstr=#99000000, endcolorstr=#99000000);
}

.box-yellow {
	margin: 10rpx 0; // 5px
	border-radius: 10rpx; // 5px
	overflow: hidden;
	background-image: linear-gradient(to right, #ffd27d, #ffda8b, #ffe199, #ffe8a6, #ffefb4, #fff6c2, #fffdc9, #fff6c2, #ffefb4, #ffe8a6, #ffe199, #ffda8b, #ffd27d);

	filter: progid:DXImageTransform.Microsoft.gradient(startcolorstr=#99000000, endcolorstr=#99000000);
}

.box-zongse {
	margin: 10rpx 0; // 5px
	border-radius: 10rpx; // 5px
	overflow: hidden;
	background-image: linear-gradient(to right, #713800, #945920, #965a1e, #ab6520, #944f0c, #925111, #713800);

	filter: progid:DXImageTransform.Microsoft.gradient(startcolorstr=#99000000, endcolorstr=#99000000);
}

.linkgreen {
	table-layout: auto;
	color: #000;
	border-radius: 5px;
	overflow: hidden;
	text-align: center;
	background: #00FF00;
}

.linkgreen .u-row {
	min-height: 60rpx;
	font-weight: bold;
	border: 1px solid #dff9e2;
	font-size: 30rpx;
}

.duilianpt {
	table-layout: auto;
	color: #ff0000;
	border-radius: 5px;
	overflow: hidden;
	text-align: center;
	background: #fff;
}

.duilianpt .u-row {
	min-height: 60rpx;
	font-weight: bold;
	border: 1px solid #c0c0c0;
	font-size: 30rpx;
}

.duilianpt4 {
	table-layout: auto;
	color: #ff0000;
	border-radius: 5px;
	overflow: hidden;
	text-align: center;
	background: #fff;
}

.duilianpt4 .u-row {
	// height: 60rpx;
	font-weight: bold;
	border: 1px solid #c0c0c0;
	font-size: 30rpx;
}

.centent4 .u-row {
	font-weight: bold;
	font-size: 30rpx;
	border: none;
	border-right: 1px solid #c0c0c0;
	/* 给整个行右侧添加边框 */
}

.centent4 .u-row:not(:last-child) {
	border-bottom: 1px solid #c0c0c0;
	/* 仅给除了最后一个 .u-row 的下边框 */
}

.centent4 .u-col {
	font-weight: bold;
	font-size: 30rpx;
	border-left: 1px solid #c0c0c0;
	/* 给所有 .u-col 左边框 */
}



.centent5 .u-row {
	font-weight: bold;
	font-size: 30rpx;
	border: none;
	border-right: 1px solid #c0c0c0;
	/* 给整个行右侧添加边框 */
}

.centent5 .u-row:not(:last-child) {
	border-bottom: 1px solid #c0c0c0;
	/* 仅给除了最后一个 .u-row 的下边框 */
}

.centent5 .u-row:not(:first-child) {
	border-top: 1px solid #c0c0c0;
	/* 仅给除了最后一个 .u-row 的下边框 */
}

.centent5 .u-row {
	border-right: none;
}

.centent5 .u-col {
	font-weight: bold;
	font-size: 30rpx;
	border-left: 1px solid #c0c0c0;
	border-right: 1px solid #c0c0c0;
	/* 给所有 .u-col 左边框 */
}

.centent5 .u-col:first-child {
	border-left: none;
	/* 给所有 .u-col 左边框 */
}

.centent5 .u-col:last-child {
	border-right: none;
	/* 给所有 .u-col 左边框 */
}

/* 单双10码边框 */
/* 移除.centent6 内第一个<u-row>之后的<u-row>的上边框 */
.centent6 .u-row+.u-row {
	border-top: none;
}

/* 去除最顶部.u-row的顶部边框和最底部.u-row的底部边框 */
.duilianpt .centent6 .u-row:first-child {
	border-top: none;
}

.duilianpt .centent6 .u-row:last-child {
	border-bottom: none;
}

.centent7 .u-col {
	border-left: 1px solid #c0c0c0;
	margin-top: 0;
	/* 确保没有额外的上边距 */
	margin-bottom: 0;
	/* 确保没有额外的下边距 */
	padding-top: 4rpx;
	/* 根据需要调整 */
	padding-bottom: 4rpx;
	/* 根据需要调整 */
	box-sizing: border-box;
	/* 确保内边距和边框包含在高度内 */
}

.del-text {
	text-decoration: line-through;
}

.text-center {
	text-align: center;
}

.text-left {
	justify-content: none;
}

.text-left-pd5{
	padding-left: 10rpx;
}

.text-left-pd10{
	padding-left: 20rpx;
}

.more {
	font-size: 28rpx;
}

.red-text {
	color: #ff0000;
}

.green-text {
	color: #00ff00;
}

.green1-text {
	color: #008000;
}

.blue-text {
	color: #0000ff;
}

.blue1-text {
	color: #000080;
}

.black-text {
	color: black;
}

.yellow-text {
	color: #ffd27d;
}

.purple-text{
	color: #800080;
}

.magenta-text {
	color: #ff33cc;
}

.grey-text {
	color: #C0C0C0;
}

.bg-yellow {
	background-color: #FFFF00;
}

.zodiac {
	display: flex;
	flex-wrap: wrap;
	/* 允许内容换行 */
	justify-content: center;
	/* 子元素在垂直方向上居中分布 */
	align-items: center;
	/* 子元素在水平方向上居中对齐 */
}

.zodiac text {
	display: inline-block;
	margin-right: 10rpx;
	/* 或者使用其他单位，比如px */
}

.zodiac text:last-child {
	margin-right: 0;
}

.zodiac .item {
	display: flex;
	flex-wrap: wrap;
	/* 确保内容在水平排列时可以自动换行 */
	align-items: center;
	/* 子元素在水平方向上居中对齐 */
	justify-content: center;
	/* 子元素在垂直方向上居中分布 */
	// margin-right: 10rpx; /* 项目之间的水平间隔 */
	margin: 6rpx;
	/* 项目之间的垂直间隔 */
}

.zodiac .item1 {
	display: flex;
	flex-direction: column;
}

/* 左对齐 */
.align-left {
	justify-content: flex-start;
	align-items: flex-start;
}

/* 居中对齐 */
.align-center {
	justify-content: center;
}

/* 右对齐 */
.align-right {
	justify-content: flex-end;
}

/* 两端对齐 */
.align-justify {
	justify-content: space-between;
}

/* 等间距对齐 */
.align-space-around {
	justify-content: space-around;
}

// 左右边框
.bordered {
	border-left: 1px solid #c0c0c0;
	border-right: 1px solid #c0c0c0;
	margin-top: 0;
	/* 确保没有额外的上边距 */
	margin-bottom: 0;
	/* 确保没有额外的下边距 */
	padding-top: 10rpx;
	/* 根据需要调整 */
	padding-bottom: 10rpx;
	/* 根据需要调整 */
	box-sizing: border-box;
	/* 确保内边距和边框包含在高度内 */
}

.nobordered .u-row {
	border: none;
	box-sizing: border-box;

}

.nobordered .topborder {
	border-top: 1px solid #c0c0c0;
	font-size: 42rpx;
}

/* 12码中特 */
.text-container {
	display: flex;
	flex-wrap: wrap;
	/* 允许内容换行 */
	align-items: center;
	/* 垂直居中对齐 */
}

/* 左右两个 */
.text-item {
	width: 50%;
	/* 每个文本项占据容器宽度的一半 */
	display: flex;
	align-items: center;
	/* 在.text-item内部垂直居中对齐子元素 */
	justify-content: center;
	/* 如果需要，可以调整水平对齐方式 */
	box-sizing: border-box;
	/* 确保padding和border不会增加元素的总宽度 */
}

.text-bx {
	line-height: 60rpx;
	text-align: center;
	border: solid 1px #ddd;
	border-radius: 8px;
	background: #eee;
	background-image: linear-gradient(to top, #fff, #eee, #fff);
	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
	/* display: block; */
	font-weight: bold;
	text-decoration: none;
	padding-left: 0px;
	margin: 10rpx;
}

.text-bxs {
	width: 46%;
	/* 每个文本项占据容器宽度的一半 */
	display: flex;
	align-items: center;
	/* 在.text-item内部垂直居中对齐子元素 */
	justify-content: center;
	/* 如果需要，可以调整水平对齐方式 */
	box-sizing: border-box;
	/* 确保padding和border不会增加元素的总宽度 */
	
	line-height: 60rpx;
	text-align: center;
	border: solid 1px #ddd;
	border-radius: 8px;
	background: #eee;
	background-image: linear-gradient(to top, #fff, #eee, #fff);
	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
	/* display: block; */
	font-weight: bold;
	text-decoration: none;
	padding-left: 0px;
	margin: 10rpx;
}

/* 一行一行 */
.text-item1 {
	width: 100%;
	/* 每个文本项占据容器宽度的一半 */
	display: flex;
	align-items: center;
	/* 在.text-item内部垂直居中对齐子元素 */
	justify-content: center;
	/* 如果需要，可以调整水平对齐方式 */
	box-sizing: border-box;
	/* 确保padding和border不会增加元素的总宽度 */
}

@media only screen and (device-width: 375px) {

	/* 在这里放置你的样式 */
	.zodiac .item {
		font-size: 26rpx;
		justify-content: flex-start;
	}
}

@media screen and (max-width: 505px) {
	.pad {
		padding: 4rpx 4rpx; // 2px 2px
	}

	#yxym .list-title {
		font-size: 36rpx; // 18px
	}

	.riqi {
		font-size: 24rpx; // 12pt
	}

	.haoju {
		font-size: 30rpx; // 15pt
	}

	.box,
	.subnav,
	.xjbox {
		margin: 6rpx 0rpx; // 3px 0px
	}
}

@media screen and (max-width: 409px) {
	#yxym .list-title {
		font-size: 28rpx; // 14px
	}

	.zodiac .item {
		font-size: 28rpx;
		justify-content: flex-start;
	}
}

@media screen and (max-width: 505px) {
	#yxym .list-title {
		font-size: 32rpx; // 16px
	}

	.zodiac .item {
		font-size: 26rpx;
		justify-content: flex-start;
	}
}

@media screen and (max-width: 610px) {
	#yxym .list-title {
		font-size: 36rpx; // 18px
	}

	.nowrap {
		font-size: 28rpx;
		/* 根据需要调整字体大小 */
		white-space: nowrap;
		/* 确保不换行 */
	}

	.zodiac .item {
		font-size: 26rpx;
		justify-content: flex-start;
	}

	.zodiac .item text {
		margin-right: 10rpx;
	}
}

@media (max-width: 768px) {
	.zodiac .item {
		font-size: 30rpx;
		justify-content: flex-start;
	}

	.zodiac .item text {
		margin-right: 6rpx;
	}
}

.demo-layout {
	text-align: center;
	height: 50rpx; // 25px
	line-height: 50rpx; // 25px
	border-radius: 0rpx; // 0px
}

.bg-purple {
	background: #ced7e1;
}

.bg-purple-light {
	background: #e5e9f2;
}

.bg-purple-dark {
	background: #99a9bf;
}
